<template>
  <div>
    <h2>当前求和:{{ sum }}</h2>
    <button @click="sum++">点击+1</button>
  </div>
</template>
<script>
// import { ref,beforeCreate,created,beforeMount,mounted,beforeUpdate,updated,beforeDestroy,destroyed } from "vue";
import { ref,onBeforeMount,onMounted,onBeforeUpdate,onUpdated,onBeforeUnmount,onUnmounted } from "vue";

export default {
  name: "Demo",
  setup(props, context) {
    let sum = ref(0);
    //返回一个对象，常用
    onBeforeMount(() => {
      console.log("onBeforeMount")
    }),
    onMounted(() => {
      console.log("onMounted")
    }),
    onBeforeUpdate(() => {
      console.log("onBeforeUpdate")
    }),
    onUpdated(() => {
      console.log("onUpdated")

    }),
    onBeforeUnmount(() => {
      console.log("onBeforeUnmount")

    }),
    onUnmounted(() => {
      console.log("onUnmounted")

    });
    return {
      sum,
    }
  },
  
};
</script>
  
  <style>
</style>
  
 